<template>
	<view class="container">
		<view class="title">工作台</view>
		<u-navbar titleStyle="color:#FFFFFF;font-size: 30rpx;" bgColor="#177A77" title="工作台" :autoBack="true"
			leftIcon=" " />

		<view style="height: 20rpx;"></view>
		<view class="workbenches">
			<!-- 入库管理 -->
			<view style="margin-bottom: 45rpx;">
				<view class="block">
					<view class="blockRow">
						<view class="linehide"></view>
						<view>入库管理</view>
					</view>
					<!-- <view class="ritText">入库明细></view> -->
				</view>
				<view class="content">
					<view class="imageblock" @click="handelePurchaseInventory">
						<image class="imas" src="/static/work/sy_listmenu01.png" mode=""></image>
						<view>采购入库</view>
					</view>
					<view class="imageblock" @click="handeleStoreReturn">
						<image class="imas" src="/static/work/sy_listmenu02.png" mode=""></image>
						<view>退货入库</view>
					</view>
					<view class="imageblock" @click="handeleOtherInboundItems">
						<image class="imas" src="/static/work/sy_listmenu03..png" mode=""></image>
						<view>其它入库</view>
					</view>
					<view class="imageblock" @click="handleToExamine">
						<image class="imas" src="/static/work/sy_listmenu05.png" mode=""></image>
						<view>库管审核</view>
					</view>
				</view>
			</view>

			<!-- 出库管理 -->
			<view style="margin-bottom: 45rpx;">
				<view class="block">
					<view class="blockRow">
						<view class="linehide"></view>
						<view>出库管理</view>
					</view>
					<!-- <view class="ritText">出库明细></view> -->
				</view>
				<view class="content">
					<view class="imageblock" @click="handeleFindProduct">
						<image class="imas" src="/static/work/sy_listmenu21.png" mode=""></image>
						<view>成品出库</view>
					</view>
					<view class="imageblock" @click="handeleReturnOutre">
						<image class="imas" src="/static/work/sy_listmenu20.png" mode=""></image>
						<view>退货出库</view>
					</view>
					<view class="imageblock" @click="handeleOther">
						<image class="imas" src="/static/work/sy_listmenu22.png" mode=""></image>
						<view>其他出库</view>
					</view>
					<view class="imageblock" @click="handleAll">
						<image class="imas" src="/static/work/sy_listmenu22.png" mode=""></image>
						<view>合单</view>
					</view>
				</view>
			</view>

			<!-- 生产管理 -->
			<view style="margin-bottom: 52rpx;">
				<view class="blockSc" style="margin-left: 17rpx;">
					<view class="blockRow">
						<view class="linehide"></view>
						<view>生产管理</view>
					</view>
					<!-- <view class="ritText">生产单明细></view> -->
				</view>
				<view class="contentSc">
					<!-- <view class="imageblockSc" style="margin-right: 45rpx;margin-left: -2rpx;" @click="handeleBomList">
						<image class="imas" src="/static/work/sy_listmenu04.png" mode=""></image>
						<view>BOM单管理</view>
					</view> -->
					<view class="imageblockSc" @click="handelefinishedProduct">
						<image class="imas" src="/static/work/sy_listmenu08.png" mode=""></image>
						<view>成品入库</view>
					</view>
					<view class="imageblockSc" @click="handeleAddProduction">
						<image class="imas" src="/static/work/sy_listmenu05.png" mode=""></image>
						<view>生产单管理</view>
					</view>
					<!-- <view class="imageblockSc"  @click="handelePicking">
						<image class="imas" src="/static/work/sy_listmenu06.png" mode=""></image>
						<view>生产领料</view>
					</view> -->
					<view class="imageblockSc" @click="handeleRawMaterial">
						<image class="imas" src="/static/work/sy_listmenu07.png" mode=""></image>
						<view>原料退回</view>
					</view>
					<view class="imageblockSc"></view>
				</view>
				<!-- <view class="content" style="margin-left: 17rpx;" @click="handelefinishedProduct">
					<view class="imageblock">
						<image class="imas" src="/static/work/sy_listmenu08.png" mode=""></image>
						<view>生产入库</view>
					</view>
				</view> -->
			</view>


			<!-- 常用功能 -->
			<view>
				<view class="block">
					<view class="blockRow">
						<view class="linehide"></view>
						<view>常用功能</view>
					</view>
					<!-- <view class="ritText">信息实时掌握</view> -->
				</view>
				<view class="content">
					<view class="imageblock" @click="show=true">
						<image class="imas" src="/static/work/sy_listmenu09.png" mode=""></image>
						<view>审批待办</view>
					</view>
					<view class="imageblock" @click="handelSearch">
						<image class="imas" src="/static/work/sy_listmenu10.png" mode=""></image>
						<view>货品检索</view>
					</view>
					<view class="imageblock" @click="handleInventpryList">
						<image class="imas" src="/static/work/sy_listmenu11.png" mode=""></image>
						<view>库存盘点</view>
					</view>
					<view class="imageblock" @click="show=true">
						<image class="imas" src="/static/work/sy_listmenu12.png" mode=""></image>
						<view>过期预警</view>
					</view>
				</view>
				<view class="content">
					<view class="imageblock" @click="show=true">
						<image class="imas" src="/static/work/sy_listmenu13.png" mode=""></image>
						<view>库存预警</view>
					</view>
					<view class="imageblock" @click="handeleScane">
						<image class="imas" src="/static/work/sy_listmenu14.png" mode=""></image>
						<view>扫码查询</view>
					</view>
					<view class="imageblock" @click="handeleWarehouseManagement">
						<image class="imas" src="/static/work/sy_listmenu15.png" mode=""></image>
						<view>库位管理</view>
					</view>
					<view class="imageblock" @click="show=true">
						<image class="imas" src="/static/work/sy_listmenu16.png" mode=""></image>
						<view>库存调拨</view>
					</view>
				</view>
				<view class="content">
					<view class="imageblock" @click="handeleBox">
						<image class="imas" src="/static/work/sy_listmenu20_zyx.png" mode=""></image>
						<view>转运箱</view>
					</view>

					<!-- <view class="imageblock" @click="handleLoading">
						<image class="imas" src="/static/work/sy_listmenu21.png" mode=""></image>
						<view>返仓</view>
					</view> -->
					<view class="imageblock" @click="handeleWriteData">
						<image class="imas" src="/static/work/sy_listmenu15.png" mode=""></image>
						<view>货架管理</view>
					</view>
					<!-- <view class="imageblock" @click="handeleWarehouseManagement">
						<image class="imas" src="/static/work/sy_listmenu15.png" mode=""></image>
						<view>库位管理</view>
					</view> -->
					<view class="imageblock1" @click="handleBox">
						<image class="imas" src="/static/work/sy_listmenu16.png" mode=""></image>
						<view>写入转运箱</view>
					</view>
					<view class="imageblock1" @click="getNfc">
						<image class="imas" src="/static/work/sy_listmenu16.png" mode=""></image>
						<view>查看转运箱</view>
					</view>
				</view>
			</view>
		</view>

		<view class="header"></view>
		
		<u-popup :show="show" mode="center" @close="show=false" bgColor="transparent">
			<view>
				<image class="developing" src="/static/developing.png" mode="" @click="handleDeveloping"></image>
			</view>
		</u-popup>

		
	</view>
</template>

<script>
	import {
		getLogisticBox
	} from '@/api/store.js'
	import NFC from './NFC.js'
	export default {
		data() {
			return {
				show: false, //开发中 敬请期待控制弹窗
			}
		},
		onLoad() {
		
		},
		
		methods: {
			
			// 查看转运箱
			getNfc() {
				uni.navigateTo({
					url:'/pages/work/common/boxInformation'
				})
			},
			
			// 控制开发中敬请期待弹窗
			handleDeveloping() {
				this.show = false
			},
			// 库存盘点
			handleInventpryList() {
				this.show = true
				// uni.navigateTo({
				// 	url:'/pages/work/common/InventoryList'
				// })
			},
			// 确认装车
			handleLoading() {
				uni.navigateTo({
					url: '/pages/work/common/loading'
				})
			},
			// 合单
			handleAll() {
				uni.navigateTo({
					url: '/pages/work/outbound/onebillforAll'
				})
			},
			//明细
			handelePurchaseInventory() {
				uni.navigateTo({
					url: '/pages/work/store/cgStore'
				})
			},
			// 采购入库
			handelePurchase() {
				uni.navigateTo({
					url: '/pages/work/store/purchase'
				})
			},
			// 仓库管理
			handeleWarehouseManagement() {
				this.show = true
				// uni.navigateTo({
				// 	url: '/pages/work/common/locationList'
				// })
			},
			// 生产入库
			handelefinishedProduct() {
				// this.show = true
				uni.navigateTo({
					url: '/pages/work/produce/finishedProduct'
				})
			},
			handeleRawMaterial() {
				uni.navigateTo({
					url: '/pages/work/produce/rawMaterial'
				})
			},
			// 生产领料
			handelePicking() {
				uni.navigateTo({
					url: '/pages/work/produce/picking'
				})
			},
			//其他出库
			handeleOther() {
				this.show = true
				// uni.navigateTo({
				// 	url: '/pages/work/outbound/otherOutbound'
				// })
			},
			// 退货出库
			handeleReturnOutre() {
				this.show = true
				// uni.navigateTo({
				// 	url: '/pages/work/outbound/returnOutbound'
				// })
			},
			// 成品出库
			handeleFindProduct() {
				this.show = true
				// uni.navigateTo({
				// 	url: '/pages/work/outbound/finishedProduct'
				// })
			},
			// BOM单管理
			handeleBomList() {
				uni.navigateTo({
					url: '/pages/work/produce/bomList'
				})
			},
			// 扫码查询
			handeleScane() {
				this.show = true
				// 只允许通过相机扫码
				// uni.scanCode({
				// 	scanType: ['qrCode'], //barCode 一维码，qrCode 二维码，datamatrix Data Matrix 码，pdf417 PDF417 条码
				// 	onlyFromCamera: true,
				// 	success: res => {
				// 		uni.showLoading({
				// 			title: '加载中...'
				// 		})
				// 		console.log('条码类型：' + res.scanType);
				// 		console.log('条码内容：' + res.result);
				// 		// 这里正常应该调接口，根据接口返回结果进行跳转
				// 		// uni.navigateTo({
				// 		// 	url:'/pages/work/common/scane?id='+res.result
				// 		// })
				// 		setTimeout(() => {
				// 			uni.hideLoading()
				// 		}, 2000)
				// 	}
				// });
			},
			// 退货入库
			handeleStoreReturn() {
				this.show = true
				// uni.navigateTo({
				// 	url: '/pages/work/store/returnGoods'
				// })
			},
			// 其他入库
			handeleOtherInboundItems() {
				this.show = true
				// uni.navigateTo({
				// 	url: '/pages/work/store/otherInboundItems'
				// })
			},
			// 生产单管理
			handeleAddProduction() {
				uni.navigateTo({
					// url:'/pages/work/produce/addProductionOrder'
					url: '/pages/work/produce/productionOrderManagement'
				})
			},
			// 货品检索
			handelSearch() {
				this.show = true
				// uni.navigateTo({
				// 	url: '/pages/work/common/search'
				// })
			},
			// 采购审核
			handleToExamine() {
				uni.navigateTo({
					url: '/pages/work/store/toExamine'
				})
			},
			// 转运箱管理
			handeleBox() {
				uni.navigateTo({
					url: '/pages/work/common/box'
				})
			},
			// 写入数据
			handeleWriteData() {
				uni.navigateTo({
					url: '/pages/work/common/writeData'
				})
			},
			// 写入转运箱
			handleBox() {
				uni.navigateTo({
					url: '/pages/work/common/writeBox'
				})
			}
		},
		
	}
</script>

<style scoped>
	.box-but {
		width: 100%;
		height: 80rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: #177A77;
		border-radius: 15rpx;
		font-size: 25rpx;
		color: #FFFFFF;
		margin-top: 30rpx;
		margin-bottom: 30rpx;
	}

	.box-flex {
		width: 100%;
		height: 80rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-bottom: 1rpx solid #cccccc;
		font-size: 25rpx;
	}

	.box-1 {
		width: 100%;
		height: 100rpx;
		font-size: 35rpx;
		font-weight: bold;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.box-Block {
		width: 650rpx;
		min-height: 400rpx;
		padding: 10rpx 50rpx;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.ima {
		width: 100rpx;
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 2;
		position: absolute;
		top: 32%;
		z-index: 5;
	}

	.po-bot {
		width: 100%;
		height: 700rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		top: 0;
		z-index: 5;
	}

	.dot {
		width: 70px;
		height: 70px;
		display: block;
		position: absolute;
		border-radius: 50%;
		background-color: #FFFFFF;
		margin-top: -150rpx;
		margin-right: 0rpx;
		z-index: 5;
	}

	.dot::after {
		width: 100%;
		height: 100%;
		content: "";
		border-radius: 50%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -2;
		background-color: #177A77;
		animation: dot-play 4s linear 400ms infinite;
	}

	.dot::before {
		width: 100%;
		height: 100%;
		content: "";
		border-radius: 50%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -1;
		background-color: #DDECEB;
		animation: dot-play 4s linear 200ms infinite;
		animation-delay: 2s;
		/* 延迟 2s */
	}

	@keyframes dot-play {
		from {
			transform: scale(1);
			opacity: .2;
		}

		to {
			transform: scale(4);
			opacity: 0;
		}
	}

	.developing {
		width: 490rpx;
		height: 600rpx;
	}

	.header {
		width: 750rpx;
		height: 405rpx;
		background-color: #177A77;
		/* background: linear-gradient(0deg, #177A77, #4B9C6D); */
		position: absolute;
		top: 0;
		z-index: 1;
		left: 0;
	}

	.contentSc {
		width: 659rpx;
		height: 120rpx;
		display: flex;
		align-items: center;
		margin-top: 35rpx;
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.content {
		width: 624rpx;
		height: 120rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 35rpx;
	}

	.imageblockSc {
		width: 132rpx;
		height: 119rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
		font-family: Microsoft YaHei;
		font-weight: 400;
		font-size: 24rpx;
		color: #333333;
		/* margin-right: 81rpx; */
	}

	.imageblock1 {
		/* width: 97rpx; */
		height: 119rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
		font-family: Microsoft YaHei;
		font-weight: 400;
		font-size: 24rpx;
		color: #333333;
	}

	.imageblock {
		width: 97rpx;
		height: 119rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
		font-family: Microsoft YaHei;
		font-weight: 400;
		font-size: 24rpx;
		color: #333333;
	}

	.imas {
		width: 77rpx;
		height: 76rpx;
	}

	.ritText {
		font-weight: 400;
		font-size: 24rpx;
		color: #999999;
		line-height: 55rpx;
	}

	.blockRow {
		display: flex;
		align-items: center;
		font-family: Microsoft YaHei;
		font-weight: 500;
		font-size: 30rpx;
		color: #333333;
		line-height: 55rpx;
	}

	.blockSc {
		width: 625rpx;
		height: 31rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.block {
		width: 100%;
		height: 31rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.linehide {
		width: 8rpx;
		height: 30rpx;
		background: linear-gradient(0deg, #177A77, #4B9C6D);
		border-radius: 4rpx;
		border: 0px solid #000000;
		margin-right: 16rpx;
	}

	.workbenches {
		margin-top: 57rpx;
		width: 710rpx;
		height: calc(100vh - 178rpx);
		background-color: #ffffff;
		border-radius: 20rpx;
		padding: 63rpx 24rpx 24rpx 14rpx;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		align-items: center;
		overflow-y: auto;
		z-index: 2;
	}

	.title {
		font-weight: 400;
		font-size: 30rpx;
		color: #FFFFFF;
		margin-top: 64rpx;
		z-index: 2;
	}

	.container {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	page {
		background-color: #F9F9F9;
	}
</style>